<template>
    <div class="newsinfo-container">
           <div style="text-align:right;">
              <button class="btn btn-danger" @click='black()' >返回</button>
           </div>
           <h4>{{newsinfo.comment_author}}</h4>
        
           <p class="subtitle">
               <span>发表时间：{{newsinfo.comment_date | dataFormat('YYYY-MM-DD') }}</span>
               <span>点击{{newsinfo.sub_comment_count}}次</span>
           </p>
       <div class="content" v-html="newsinfo.comment_content"> 

       </div>

 <!-- 评论子组件 -->
 <comment-box>
   
 </comment-box>

    </div>
</template>
<script>
import { Toast } from "mint-ui";
import comment from '../subcomponents/comment.vue'
export default {
  data() {
    return {
      newsinfo: []
    };
  },
  created() {
    this.getnewsinfo();
  },
  methods: {
    getnewsinfo() {
      //   获取当前传入的id
      // 发送请求，获取数据
      // 将数据赋给data
      // 渲染页面

      this.$http.get("jandan/pics?page=1").then(result => {
          console.log(result.body)
        var i = this.$route.params.id;
        if (result.body.code == 1) {
         this.newsinfo = result.body.data.comments[i];

        } else {
          Toast("获取轮播图数据失败!");
        }
      });
    },
     black(){
          window.history.go(-1)
     }
  },
  components:{
    "comment-box":comment
  }
};
</script>
<style lang="scss" scoped>
.newsinfo-container {
  padding: 0 5px;
  color: #26a2f2;
  text-align: center;
  margin: 15px 0;
  .subtitle {
    display: flex;
    justify-content: space-between;
  }
  .content {
    img {
      width: 100%;
    }
  }
}
</style>
